<template>
  <div id="yyjd"></div>
</template>

<script>
import map from "@/assets/map.js";
export default {
  name: "HelloWorld",
  data() {
    return {};
  },
  mounted() {
    window.tedp = new this.$trame({
      elem: "yyjd",
      width: 3840,
      height: 1080,
      navtop: 100,
      prop: [1280, 1280],
      showSub: false,
      compss: [
        {
          sub: "首页",
          isActive: true,
          left: {
            MainLeft: () => import("@/components/index/MainLeft.vue"),
          },
          right: {
            MainRight: () => import("@/components/index/MainRight.vue"),
          },
        },
      ],
      gisType: "bj",
      gisrefer: {
        configLink: "./static/sceneConfig_arcgis.json",
        gisserver: map.gissUrl,
      },
      nav: {
        navMain: () => import("@/components/nav/navMain.vue"),
      },
      module: {
        bottomBtn: () => import("@/components/module/bottomBtn.vue"),
                 tdchange: () => import("@/components/module/tdchange.vue"),
        // overlay: () => import("@/components/module/overlay.vue"),
      },
      gisInit(e) {
        let webSdk = e;

        webSdk.coreMap.scene.globe.depthTestAgainstTerrain = false;
        webSdk.coreMap.scene.screenSpaceCameraController.maximumZoomDistance = 100000;
        let utc = Geoworld.JulianDate.fromDate(new Date("2019/10/04 03:00:00")); //UTC //转为JulianDate
        webSdk.coreMap.clock.currentTime = Geoworld.JulianDate.addHours(
          utc,
          8,
          new Geoworld.JulianDate()
        ); //北京时间=UTC+8=GMT+8
        webSdk.coreMap.imageryLayers.removeAll();

        /*******默认视角****************/
        let object = {
          type: "set",
          value: {
            destination: Geoworld.Cartesian3.fromDegrees(
              121.47114056535165,
              31.18360994747274,
              2743.775905870735
            ),
            orientation: {
              heading: 0.02349882528748548,
              pitch: -0.5870472970119449,
              roll: 0.00008400809888708949,
            },
          },
        };
        map.setView(webSdk, object);

        /*******加载影像****************/
        webSdk.factory.createImageryLayer({
          sourceType: "tms",
          url: map.imageryUrl,
          rectangle: new Geoworld.Rectangle(
            Geoworld.Math.toRadians(parseFloat(119.9483004956607)),
            Geoworld.Math.toRadians(parseFloat(30.516406947148113)),
            Geoworld.Math.toRadians(parseFloat(122.99769466587101)),
            Geoworld.Math.toRadians(parseFloat(32.27707188251892))
          ),
        });

        /*******加载白膜****************/
        let apa = 0.8;
        let entity = map.bmdata;
        //最高层白膜数据
        let options1 = {
          url: map.bmxpUrl,
          version: "1.3.0",
          params: [
            {
              typename: "高层建筑",
              bbox: "121.46694698761348,31.214167159386932,121.47853691055006,31.22803358388287",
            },
          ],

          maximumHeight: 80,
          minimumHeight: 0,
          featureColor: Geoworld.Color.BLUE.withAlpha(apa),
          modelHeightKey: "Height_dou",
          image: require("@/assets/image/map/HPNHgc.png"),
          useCache: true,
        };
        let en1 = map.addBmLayer(webSdk, options1);
        entity.push(en1);
        // 高度20到100范围
        let options2 = {
          url: map.bmxpUrl,
          version: "1.3.0",
          params: [
            {
              typename: "一般建筑",
              bbox: "121.4662025773871,31.21316501335474,121.47860849748426,31.228259311917768",
            },
          ],

          maximumHeight: 10,
          minimumHeight: 0,
          featureColor: Geoworld.Color.BLUE.withAlpha(apa),
          modelHeightKey: "Height_dou",
          image: require("@/assets/image/map/HPNHzc.png"),
          useCache: true,
        };
        let en2 = map.addBmLayer(webSdk, options2);
        entity.push(en2);

        /**加载街道线数据 */
        let yy_ent = map.wgline;
        let promiseroutel2 = Geoworld.GeoJsonDataSource.load(
          require("@/assets/json/hhzl_json.json")
        );
        promiseroutel2
          .then(function (dataSource) {
            let yyLightAreaRount = dataSource.entities.values;
            for (let i = 0; i < yyLightAreaRount.length; i++) {
              let positionsArrayList = [];
              let line = yyLightAreaRount[i];
              for (
                let j = 0;
                j < line.polyline.positions.getValue().length;
                j++
              ) {
                positionsArrayList.push(
                  new Geoworld.Cartesian3(
                    line.polyline.positions.getValue()[j].x,
                    line.polyline.positions.getValue()[j].y,
                    line.polyline.positions.getValue()[j].z + 5
                  )
                );
              }

              let ployline = {
                name: "polyline_1",
                id: webSdk.factory.createUUID(),

                lineColor: new Geoworld.PolylineTrailLinkMaterialProperty({
                  duration: 28000,
                  repeat: 2,
                  color: Geoworld.Color.WHITE.withAlpha(0.5),
                  image: require("@/assets/image/map/xingzheng.png"),
                }),
                type: "polylineTrail",
                lineWidth: 6 * tedp.mult,
                outline: false,

                positions: positionsArrayList,
              };
              let linem = webSdk.factory.createPolyline(ployline);
              yy_ent.push(linem);
            }
          })
          .otherwise(function (error) {
            console.log(error);
          });
        let points = [
          [121.469024, 31.217197],
          [121.472044, 31.221864],
          [121.473261, 31.226051],
        ];
        let pointsName = ["G0402", "G0403", "G0401"];
        let param = {
          pointsName: pointsName,
          points: points,
          name: "文字",
          font: 24 * tedp.mult,
          fillColor: Geoworld.Color.YELLOW,
          outlineWidth: 1 * tedp.mult,
          style: Geoworld.LabelStyle.FILL_AND_OUTLINE,
          outlineColor: Geoworld.Color.fromCssColorString("#FF0000"),
        };
        map.wgpoint = map.addLabel(webSdk, param);

        /***鼠标左击事件 */
        map.mapLeftClick(tedp.webGis);
      },
      subClick(e) {},
    });
  },
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
</style>
